/**
*@Author: 周贞荣
*@Date 2021/8/27 12:35
*@Description 组件名称首字母大写
*@File MainLeft.vue 文件名称
*@Modify 最近修改人
*/
<template>
    <div class="menuLeft paddingT10 h100 fixed left top flex flex-column">
        <div class="w100 text-center topLogo radius5 cursor">罄</div>
        <div class="w100 colorFF flex-full">
            <div class="marginT20 menuItem flex w100 flex-column items-center cursor">
                <i class="el-icon-s-home"></i>
                <p class="paddingT5 font12">首页</p>
            </div>
        </div>
        <div class="paddingV20 flex flex-column items-center">
            <el-avatar>周</el-avatar>
        </div>
    </div>
</template>

<script>
    export default {
        name: "MainLeft",
        data() {
            return {}
        },
        methods: {},
        /**
         * 组件加载渲染完成执行回调方法
         */
        mounted() {

        }
    }
</script>

<style scoped lang="scss">
    /*
*当前组件样式编写域
*/
    .menuLeft {
        width: 70px;
        background-color: #6F62E6;
    }

    .menuItem i {
        font-size: 28px;
    }

    .topLogo {
        margin: 0 auto;
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        font-size: 30px;
        background-color: #fff;
        color: #6F62E6;
        font-weight: bold;
    }
</style>
